<template>
	<view class="padding-20">
		<!-- 商品信息 -->
		<view class="flex-boderRadius-view bg-fff padding-20 margin-bottom20">
			<view class="flex margin-bottom20">
				<image class="img-160 margin-right20 border-radius10" :src="goods.image" mode=""></image>
				<view class="flex1 flex-column">
					<view class="fontSize-16 color-000 margin-bottom10">{{goods.title}}</view>
					<!-- <view class="fontSize-13 color-999 margin-bottom10">全国门店通用</view> -->
					<view class="flex-between">
						<view>
							<view class="fontSize-13 color-FE3232">￥<text class="fontSize-16">{{goods.price}}</text></view>
						</view>
						<u-number-box v-model="form.count"></u-number-box>
					</view>
				</view>
			</view>
		</view>
		
		<!-- 地址 -->
		<view class="flex-between flex-boderRadius-view bg-fff padding-20 margin-bottom30" 
		@click="$tools.navigateTo('/pages/index/index-list/store-list')">
			<view class="fontSize-16 color-000">适用门店</view>
			<view class="flex-alignItems-center">
				<view class="fontSize-13 color-999 margin-right20">查看全部门店</view>
				<u-icon name="arrow-right" color="#333333" size="20"></u-icon>
			</view>
		</view>
		
		<view class="flex-boderRadius-view bg-fff padding-20 margin-bottom20">
			<view class="fontSize-16 color-000 margin-bottom20">使用须知</view>
			<view class="fontSize-15 color-000">
				<u-parse :content="goodsDetail.content"></u-parse>
			</view>
		</view>
		
		<!-- 备注 -->
		<!-- <view class="flex-boderRadius-view bg-fff padding-20">
			<view class="fontSize-16 color-000 margin-bottom20">留言：</view>
			<view class="bg-f6f6f6">
				<u--textarea v-model="value1" height="100" placeholder="请输入内容" ></u--textarea>
			</view>
		</view> -->
		
		<!-- 底部操作栏 -->
		<view class="position-fixed-100bottom">
			<view class="flex-between bg-fff padding-30">
				<view style="color: #C90F0F;" class="margin-bottom10">
					<text class="fontSize-15">￥</text>
					<text class="fontWeight-bold" style="font-size: 20px;">{{allPrice}}</text>
				</view>
				<view class="shop-buys-btn flex-center" @click="confirmBuy">立即购买</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data(){
			return{
				value1: '',
				num:'',
				form: {},
				goods: {},
				goodsDetail:'',
				// 防抖
				isSubmit:true,
			}
		},
		onLoad(e) {
			if (e.form) {
				console.log(e.form)
				this.form = JSON.parse(e.form)
			}
			if (e.goods) {
				this.goods = JSON.parse(e.goods)
				console.log(this.goods)
				this.spu_price = this.goods.sku_price
			}
		},
		onShow() {
			this.getGoodsDetail()
		},
		computed: {
			allPrice() {
				let price = this.spu_price ? this.spu_price : this.goods.price
				let totalPrice = ((Number(price * this.form.count))).toFixed(2)
				totalPrice = totalPrice>0?totalPrice:0.00
				// return (Number(this.spu_price * this.form.count) - Number(this.score)).toFixed(2)
				return totalPrice
			}
		},
		methods:{
			// 获取商品详情
			async getGoodsDetail() {
				let res = await this.$http.post(this.$api.goods_detail, {
					goods_id: this.form.goods_id
				}, {
					token: true
				})
				this.goodsDetail = res.data.goods
			},
			// 创建订单
			 async confirmBuy(){
				 if(!this.isSubmit) return false
				 this.isSubmit = false
			     let res = await this.$http.post(this.$api.order_create,{
					 goods_id:this.goodsDetail.id,
					 count:this.form.count
				 },{token:true})
				 console.log(res)
				 if(res.code ==1){
					 this.payOrder(res.data.order_no)
				 }
			},
			// 支付
			async payOrder(order_no){
				let res = await this.$http.post(this.$api.order_test,{order_no:order_no},{token:true})
				// let res = await this.$http.post(this.$api.pay,{order_no:order_no,pay_type:1},{token:true})
				console.log(res)
				this.isSubmit = true
				this.$tools.reLaunch('/pages/mine/mine-list/coupons-list')
			}
		}
	}
</script>

<style lang="scss" scoped>
	.shop-buys-btn{
		width: 240rpx;
		height: 80rpx;
		font-weight: 400;
		font-size: 30rpx;
		color: #FFFFFF;
		background: #967C5E;
		border-radius: 40rpx 40rpx 40rpx 40rpx;
	}
	.insufficient-popup-btn1{
		width: 200rpx;
		height: 70rpx;
		font-weight: 400;
		font-size: 28rpx;
		color: #FFFFFF;
		background: #967C5E;
		border-radius: 45rpx 45rpx 45rpx 45rpx;
	}
	.insufficient-popup-btn{
		width: 200rpx;
		height: 70rpx;
		font-weight: 400;
		font-size: 28rpx;
		color: #755F47;
		background: rgba(150,124,94,0.14);
		border-radius: 45rpx 45rpx 45rpx 45rpx;
		border: 1rpx solid #967C5E;
	}
	.insufficien-popup-view{
		width: 500rpx;
		// height: ;
		padding: 30rpx;
		// background-color: #F8F6F3;
		border-radius: 20rpx;
	}
</style>